<template>
  <div class="basic-info account">
    <div class="account-tab">
      <router-link v-for="(item,index) in navData" :key="index" :to="{name: item.src}">{{ item.title }}</router-link>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      navData: [
        {
          title: '站点设置',
          src: 'setting'
        },
        {
          title: '公司介绍',
          src: 'company'
        },
        {
          title: '联系方式',
          src: 'contact'
        },
        {
          title: '广告图',
          src: 'ad'
        }
      ]
    }
  }
}
</script>

<style lang="scss">
  .account {
      .account-tab {
          border-bottom: 1px solid #eff1f5;
          padding: 10px 25px 0 25px;
          a {
              display: inline-block;
              line-height: 48px;
              height: 48px;
              padding: 0 10px;
              font-size: 14px;
              color: rgba($color: #1B2127, $alpha: 0.8);
              margin-right: 15px;
              &.router-link-exact-active {
                  border-bottom: 3px solid #409EFF;
                  color: #1b2127;
              }
          }
      }
      .title {
          font-size: 16px;
      }
      .info-list {
          width: 50%;
          display: inline-block;
          padding: 0;
          li {
              width: 100%;
              padding: 5px 0;
              border-bottom: 1px solid #ddd;
          }
      }
  }
</style>